<template>
  <div class="app2">
    子组件1
    <h4>玩具：{{ toy }}</h4>
    <h4>书籍：{{ book }}本</h4>
    <button @click="minusHouse($parent)">分一套房</button>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";

let toy = ref("奥特曼");
let book = ref(3);
function minusHouse(parent: any) {
  parent.house -= 1;
}
// 把数据交给外部
defineExpose({ toy, book });
</script>

<style scoped>
.app2 {
  padding: 10px;
  margin: 10px;
  background-color: skyblue;
  border-radius: 5px;
  box-shadow: 0 0 10px;
}
</style>
